<template>
  <div>
    <el-button @click="back">返回</el-button>
    <div class="main_h">用户姓名：{{detail.orderListVO.userName}}</div>
    <el-row>
      <el-col :span="8">
        <div class="list">
          <span>证件号码：{{detail.orderListVO.paper}}</span>
        </div>
        <div class="list">
          <span>手机号码：{{detail.orderListVO.mobile}}</span>
        </div>
        <div class="list">
          <span>用户地区：{{detail.template.provinceValue}} - {{detail.template.cityValue}} - {{detail.template.countryValue}}</span>
        </div>
        <div class="list">
          <span>预约手机号：{{detail.template.bookMobile}}</span>
        </div>
        <div class="list">
          <span>
            所患疾病：
            <span v-if="detail.template.sickType==1">意外</span>
            <span v-if="detail.template.sickType==2">疾病</span>
            <span v-if="detail.template.sickType==3">重疾</span>
            -
            {{detail.template.sickName}}
          </span>
        </div>
        <div class="list">
          <span>期望就诊地区：{{detail.template.wantProvinceValue}} - {{detail.template.wantCityValue}} - {{detail.template.wantCountryValue}}</span>
        </div>
        <div class="list">
          <span>预约医院：{{detail.template.hospitalName}}</span>
        </div>
        <div class="list">
          <span>预约科室：{{detail.template.dept1Value}} - {{detail.template.dept2Value}}</span>
        </div>
      </el-col>
      <el-col :span="8">
        <div class="list">
          <span>入院时间：{{detail.template.enterHospitalTime |formatDate}}</span>
        </div>
        <div class="list">
          <span>已交费用：{{detail.template.payMoney}}</span>
        </div>
        <div class="list">
          <span>催缴费用：{{detail.template.needMoney}}</span>
        </div>
        <div class="list">
          <span>本次社保直结：{{detail.template.sheBaoPay==true?'是':'否'}}</span>
        </div>
        <div class="list">
          <span>接受新农合盖章：{{detail.template.nongHeSign==true?'是':'否'}}</span>
        </div>
      </el-col>
      <el-col :span="8" style="border:1px solid #eaeaea;padding:15px;background:#f9f9f9">
        <div class="list">
          <span>订单号：{{detail.template.productId}}</span>
        </div>
        <div class="list">
          <span>接单人员地区：{{detail.groundPersonListVO.provinceValue}} - {{detail.groundPersonListVO.cityValue}} - {{detail.groundPersonListVO.countryValue}}</span>
        </div>
        <div class="list">
          <span>接单人员姓名：{{detail.groundPersonListVO.userName}}</span>
        </div>
        <div class="list">
          <span>派单备注：{{remark}}</span>
        </div>
        <div class="list" style="color:#c00;font-weight:bold;">
          <span v-if="deleteFlag==true">订单状态：已完成-已关闭</span>
          <span v-else>订单状态：{{stateValue}}-{{childStateValue}}</span>
        </div>
        <div class="list">
          <el-button type="primary" @click="zhuandan=true;intPerson()">转单</el-button>
          <el-button v-if="deleteFlag==false" type="danger" @click="close=true">关闭订单</el-button>
          <span style="margin-left:10px;" v-if="deleteFlag==true">订单关闭原因:{{reason}}</span>
        </div>
      </el-col>
    </el-row>
    <div class="main_h">订单流程</div>
    <div class="timeline" style="margin-top:20px;">
      <div class="timeline_num">1</div>
      <div class="timeline_main">
        <div class="timeline_title">已派发订单接单</div>
        <div class="red" v-if="detail.orderFlow.groundPersonId==null">未接单</div>
        <div v-if="detail.orderFlow.groundPersonId!=null">
          <span v-if="detail.personNames[0]">负责人：{{detail.personNames[0]}}&nbsp;&nbsp;&nbsp;&nbsp;</span>
          <span
            class="green"
          >{{detail.groundPersonListVO.provinceValue}}-{{detail.groundPersonListVO.cityValue}}-{{detail.groundPersonListVO.countryValue}} {{detail.groundPersonListVO.userName}} 已接单</span>
          {{detail.orderFlow.groundPersonIdTime|formatDate2}}
        </div>
      </div>
    </div>
    <div class="timeline">
      <div class="timeline_num">2</div>
      <div class="timeline_main">
        <div class="timeline_title">与患者联系人沟通服务细节</div>
        <div class="red" v-if="detail.orderFlow.hasContact!=true">未沟通</div>
        <div v-if="detail.orderFlow.hasContact">
          <span v-if="detail.personNames[1]">负责人：{{detail.personNames[1]}}&nbsp;&nbsp;&nbsp;&nbsp;</span>
          <span class="green">已沟通</span>
          {{detail.orderFlow.hasContactTime|formatDate2}}&nbsp;&nbsp;
          沟通备注：{{detail.orderFlow.contactRemark}}
        </div>
      </div>
    </div>
    <div class="timeline">
      <div class="timeline_num">3</div>
      <div class="timeline_main">
        <div class="timeline_title">检查并携带相关协议无误</div>
        <div class="red" v-if="detail.orderFlow.hasChecked!=true">未检查</div>
        <div v-if="detail.orderFlow.hasChecked">
          <span v-if="detail.personNames[2]">负责人：{{detail.personNames[2]}}&nbsp;&nbsp;&nbsp;&nbsp;</span>
          <span class="green">已检查协议</span>
          {{detail.orderFlow.hasContactTime|formatDate2}}
        </div>
      </div>
    </div>
    <div class="timeline">
      <div class="timeline_num">4</div>
      <div class="timeline_main">
        <div class="timeline_title">提交押金垫付已签署文件</div>
        <div>
          <span v-if="detail.personNames[3]">负责人：{{detail.personNames[3]}}&nbsp;&nbsp;&nbsp;&nbsp;</span>
          <span v-if="detail.orderFlow.prePayFileConfirm==true" class="green">资料已确认&nbsp;&nbsp;</span>
          <span v-if="detail.orderFlow.prePayFileConfirm==false" class="red">资料已驳回&nbsp;&nbsp;</span>
          <span
            v-if="detail.orderFlow.prePayFileConfirm!=null"
          >{{detail.orderFlow.prePayFileConfirmTime|formatDate2}}&nbsp;&nbsp;</span>
          <el-button
            v-if="detail.orderFlow.prePayFileConfirm!=true"
            size="small"
            type="primary"
            @click="detail.orderFlow.prePayFileConfirm=true;submit();postWx('1')"
          >资料确认</el-button>
          <el-button
            v-if="detail.orderFlow.prePayFileConfirm==null"
            size="small"
            type="warning"
            @click="detail.orderFlow.prePayFileConfirm=false;submit();postWx('2')"
          >资料驳回</el-button>

          <el-button size="small" @click="addUpload=true" type="success">补充上传</el-button>
          <el-button size="small" @click="addZip('1')" type="success">打包下载</el-button>
          <el-checkbox style="margin-left:10px;" v-model="checkAll" @change="handleCheckAllChange">全选</el-checkbox>
        </div>
        <ul v-if="prePayFilesList" class="piclist">
    
          <li v-if="prePayFilesList[0]!=''" v-for="(item,index) in prePayFilesList[0]">
            <img @click="imgLook(item+'!small')" :src="item+'!small'">
            <span>门诊病历影像件{{index+1}}</span>
            <div class="checkdiv"><el-checkbox @change="handleCheckedCitiesChange" v-model="files1" :label="item+';门诊病历影像件'+(index+1)" ></el-checkbox></div>
            <el-checkbox style="display:none;" v-model="files1a" :checked="ischecked" :label="item+'!small;门诊病历影像件'+(index+1)" ></el-checkbox>
          </li>
          <li v-if="prePayFilesList[1]!=''" v-for="(item,index) in prePayFilesList[1]">
           <img @click="imgLook(item+'!small')" :src="item+'!small'">
            <span>医疗垫付协议书{{index+1}}</span>
            <div class="checkdiv"><el-checkbox @change="handleCheckedCitiesChange" v-model="files1" :label="item+';医疗垫付协议书'+(index+1)" ></el-checkbox></div>
            <el-checkbox style="display:none;" v-model="files1a" :checked="ischecked" :label="item+'!small;医疗垫付协议书'+(index+1)" ></el-checkbox>
          </li>
          <li v-if="prePayFilesList[2]!=''" v-for="(item,index) in prePayFilesList[2]">
            <img @click="imgLook(item+'!small')" :src="item+'!small'">
            <span>企业版保险金额授权书{{index+1}}</span>
            <div class="checkdiv"><el-checkbox @change="handleCheckedCitiesChange" v-model="files1" :label="item+';企业版保险金额授权书'+(index+1)" ></el-checkbox></div>
            <el-checkbox style="display:none;" v-model="files1a" :checked="ischecked" :label="item+'!small;企业版保险金额授权书'+(index+1)" ></el-checkbox>
          </li>
          <li v-if="prePayFilesList[3]!=''" v-for="(item,index) in prePayFilesList[3]">
           <img @click="imgLook(item+'!small')" :src="item+'!small'">
            <span>企业版受托人声明书{{index+1}}</span>
            <div class="checkdiv"><el-checkbox @change="handleCheckedCitiesChange" v-model="files1" :label="item+';企业版受托人声明书'+(index+1)" ></el-checkbox></div>
            <el-checkbox style="display:none;" v-model="files1a" :checked="ischecked" :label="item+'!small;企业版受托人声明书'+(index+1)" ></el-checkbox>
          </li>
          <li v-if="prePayFilesList[4]!=''" v-for="(item,index) in prePayFilesList[4]">
            <img @click="imgLook(item+'!small')" :src="item+'!small'">
            <span>个人版保险金领款授权书{{index+1}}</span>
            <div class="checkdiv"><el-checkbox @change="handleCheckedCitiesChange" v-model="files1" :label="item+';个人版保险金领款授权书'+(index+1)" ></el-checkbox></div>
            <el-checkbox style="display:none;" v-model="files1a" :checked="ischecked" :label="item+'!small;个人版保险金领款授权书'+(index+1)" ></el-checkbox>
          </li>
          <li v-if="prePayFilesList[5]!=''" v-for="(item,index) in prePayFilesList[5]">
           <img @click="imgLook(item+'!small')" :src="item+'!small'">
            <span>个人版受托人声明书{{index+1}}</span>
            <div class="checkdiv"><el-checkbox @change="handleCheckedCitiesChange" v-model="files1" :label="item+';个人版受托人声明书'+(index+1)" ></el-checkbox></div>
            <el-checkbox style="display:none;" v-model="files1a" :checked="ischecked" :label="item+'!small;个人版受托人声明书'+(index+1)" ></el-checkbox>
          </li>
          <li v-if="prePayFilesList[6]!=''" v-for="(item,index) in prePayFilesList[6]">
            <img @click="imgLook(item+'!small')" :src="item+'!small'">
            <span>个人理赔申请书{{index+1}}</span>
            <div class="checkdiv"><el-checkbox @change="handleCheckedCitiesChange" v-model="files1" :label="item+';个人理赔申请书'+(index+1)" ></el-checkbox></div>
            <el-checkbox style="display:none;" v-model="files1a" :checked="ischecked" :label="item+'!small;个人理赔申请书'+(index+1)" ></el-checkbox>
          </li>
          <li v-if="prePayFilesList[7]!=''" v-for="(item,index) in prePayFilesList[7]">
           <img @click="imgLook(item+'!small')" :src="item+'!small'">
            <span>用户身份证正面{{index+1}}</span>
            <div class="checkdiv"><el-checkbox @change="handleCheckedCitiesChange" v-model="files1" :label="item+';用户身份证正面'+(index+1)" ></el-checkbox></div>
            <el-checkbox style="display:none;" v-model="files1a" :checked="ischecked" :label="item+'!small;用户身份证正面'+(index+1)" ></el-checkbox>
          </li>
          <li v-if="prePayFilesList[8]!=''" v-for="(item,index) in prePayFilesList[8]">
            <img @click="imgLook(item+'!small')" :src="item+'!small'">
            <span>用户身份证反面{{index+1}}</span>
            <div class="checkdiv"><el-checkbox @change="handleCheckedCitiesChange" v-model="files1" :label="item+';用户身份证反面'+(index+1)" ></el-checkbox></div>
            <el-checkbox style="display:none;" v-model="files1a" :checked="ischecked" :label="item+'!small;用户身份证反面'+(index+1)" ></el-checkbox>
          </li>
          <li v-if="prePayFilesList[9]!=''" v-for="(item,index) in prePayFilesList[9]">
           <img @click="imgLook(item+'!small')" :src="item+'!small'">
            <span>用户保单复印件{{index+1}}</span>
            <div class="checkdiv"><el-checkbox @change="handleCheckedCitiesChange" v-model="files1" :label="item+';用户保单复印件'+(index+1)" ></el-checkbox></div>
            <el-checkbox style="display:none;" v-model="files1a" :checked="ischecked" :label="item+'!small;用户保单复印件'+(index+1)" ></el-checkbox>
          </li>
          <li v-if="prePayFilesList[10]!=''" v-for="(item,index) in prePayFilesList[10]">
            <img @click="imgLook(item+'!small')" :src="item+'!small'">
            <span>用户银行卡正面{{index+1}}</span>
            <div class="checkdiv"><el-checkbox @change="handleCheckedCitiesChange" v-model="files1" :label="item+';用户银行卡正面'+(index+1)" ></el-checkbox></div>
            <el-checkbox style="display:none;" v-model="files1a" :checked="ischecked" :label="item+'!small;用户银行卡正面'+(index+1)" ></el-checkbox>
          </li>
          <li v-if="prePayFilesList[11]!=''" v-for="(item,index) in prePayFilesList[11]">
            <img @click="imgLook(item+'!small')" :src="item+'!small'">
            <span>预交费凭证{{index+1}}</span>
            <div class="checkdiv"><el-checkbox @change="handleCheckedCitiesChange" v-model="files1" :label="item+';预交费凭证'+(index+1)" ></el-checkbox></div>
            <el-checkbox style="display:none;" v-model="files1a" :checked="ischecked" :label="item+'!small;预交费凭证'+(index+1)" ></el-checkbox>
          </li>
          <li v-if="prePayFilesList[12]!=''" v-for="(item,index) in prePayFilesList[12]">
            <img @click="imgLook(item+'!small')" :src="item+'!small'">
            <span>社保卡或新农合{{index+1}}</span>
            <div class="checkdiv"><el-checkbox @change="handleCheckedCitiesChange" v-model="files1" :label="item+';社保卡或新农合'+(index+1)" ></el-checkbox></div>
            <el-checkbox style="display:none;" v-model="files1a" :checked="ischecked" :label="item+'!small;社保卡或新农合'+(index+1)" ></el-checkbox>
          </li>
          <li v-if="prePayFilesList[13]!=''" v-for="(item,index) in prePayFilesList[13]">
           <img @click="imgLook(item+'!small')" :src="item+'!small'">
            <span>入院通知书{{index+1}}</span>
            <div class="checkdiv"><el-checkbox @change="handleCheckedCitiesChange" v-model="files1" :label="item+';入院通知书'+(index+1)" ></el-checkbox></div>
            <el-checkbox style="display:none;" v-model="files1a" :checked="ischecked" :label="item+'!small;入院通知书'+(index+1)" ></el-checkbox>
          </li>
         <li v-if="prePayFilesList[14]!=''" v-for="(item,index) in prePayFilesList[14]">
            <img @click="imgLook(item+'!small')" :src="item+'!small'">
            <span>其他{{index+1}}</span>
            <div class="checkdiv"><el-checkbox @change="handleCheckedCitiesChange" v-model="files1" :label="item+';其他'+(index+1)" ></el-checkbox></div>
            <el-checkbox style="display:none;" v-model="files1a" :checked="ischecked" :label="item+'!small;其他'+(index+1)" ></el-checkbox>
          </li>
        </ul>
      </div>
    </div>
    <div class="timeline">
      <div class="timeline_num">5</div>
      <div class="timeline_main">
        <div class="timeline_title">确认垫付金额</div>
        <div v-if="detail.orderFlow.refusePay==null">请输入保险公司确定的金额
          <el-input type="number" v-model="prePayMoney1" style="width:100px"></el-input>&nbsp;&nbsp;元&nbsp;&nbsp;
          <el-button size="small" type="primary" @click="sendAddPay()">提交</el-button>
          <el-button
            size="small"
            type="warning"
            @click="detail.orderFlow.refusePay=true;submit()"
          >拒绝垫付</el-button>
        </div>

        <div v-if="detail.orderFlow.refusePay==false">
          <span v-if="detail.personNames[4]">负责人：{{detail.personNames[4]}}&nbsp;&nbsp;&nbsp;&nbsp;</span>
          保险公司确定的金额 {{prePayMoney1}}&nbsp;&nbsp;元&nbsp;&nbsp;
          <el-button size="small" type="success" @click="isSend=true">追加垫付金</el-button>
        </div>
        <div v-if="addPayList.length>0" v-for="item in addPayList" style="margin-top:10px;">
          保险公司追加的金额
          {{item}}&nbsp;&nbsp;元
        </div>
        <div v-if="isSend" style="margin-top:10px;">保险公司追加的金额
          <el-input type="number" v-model="prePayMoney2" style="width:100px"></el-input>&nbsp;&nbsp;元&nbsp;&nbsp;
          <el-button size="small" type="primary" @click="sendAddPay2">提交</el-button>
        </div>
      </div>
    </div>
    <div class="timeline">
      <div class="timeline_num">6</div>
      <div class="timeline_main">
        <div class="timeline_title">上传住院押金条</div>
        <div>
          <span v-if="detail.personNames[5]">负责人：{{detail.personNames[5]}}&nbsp;&nbsp;&nbsp;&nbsp;</span>
          <span v-if="detail.orderFlow.refuseDeposit==false" class="green">资料已确认&nbsp;&nbsp;</span>
          <span v-if="detail.orderFlow.refuseDeposit==true" class="red">资料已驳回&nbsp;&nbsp;</span>
          <span
            v-if="detail.orderFlow.refuseDeposit!=null"
          >{{detail.orderFlow.depositFilesTime|formatDate2}}&nbsp;&nbsp;</span>
          <el-button
            v-if="detail.orderFlow.refuseDeposit!=false"
            size="small"
            type="primary"
            @click="detail.orderFlow.refuseDeposit=false;submit();postWx('3')"
          >资料确认</el-button>
          <el-button
            v-if="detail.orderFlow.refuseDeposit==null"
            size="small"
            type="warning"
            @click="detail.orderFlow.refuseDeposit=true;submit();postWx('4')"
          >资料驳回</el-button>

          <el-button size="small" @click="addUpload2=true" type="success">补充上传</el-button>
          <el-button size="small" @click="addZip('2')" type="success">打包下载</el-button>
          <el-checkbox style="margin-left:10px;" v-model="checkAll2" @change="handleCheckAllChange2">全选</el-checkbox>
        </div>
        <ul class="piclist" v-if="depositFilesList">
          <li v-if="depositFilesList[0]!=''" v-for="(item,index) in depositFilesList[0]">
            <img @click="imgLook(item+'!small')" :src="item+'!small'">
            <span>住院押金条{{index+1}}</span>
             <div class="checkdiv"><el-checkbox @change="handleCheckedCitiesChange2" v-model="files2" :label="item+';住院押金条'+(index+1)" ></el-checkbox></div>
             <el-checkbox style="display:none;" v-model="files2a" :checked="ischecked" :label="item+'!small;住院押金条'+(index+1)" ></el-checkbox>
          </li>
          <li v-if="depositFilesList[1]!=''" v-for="(item,index) in depositFilesList[1]">
            <img @click="imgLook(item+'!small')" :src="item+'!small'">
            <span>入院垫付协议{{index+1}}</span>
            <div class="checkdiv"><el-checkbox @change="handleCheckedCitiesChange2" v-model="files2" :label="item+';入院垫付协议'+(index+1)" ></el-checkbox></div>
            <el-checkbox style="display:none;" v-model="files2a" :checked="ischecked" :label="item+'!small;入院垫付协议'+(index+1)" ></el-checkbox>
          </li>
          <li v-if="depositFilesList[2]!=''" v-for="(item,index) in depositFilesList[2]">
            <img @click="imgLook(item+'!small')" :src="item+'!small'">
            <span>刷卡凭条{{index+1}}</span>
            <div class="checkdiv"><el-checkbox @change="handleCheckedCitiesChange2" v-model="files2" :label="item+';刷卡凭条'+(index+1)" ></el-checkbox></div>
            <el-checkbox style="display:none;" v-model="files2a" :checked="ischecked" :label="item+'!small;刷卡凭条'+(index+1)" ></el-checkbox>
          </li>
          <li v-if="depositFilesList[3]!=''" v-for="(item,index) in depositFilesList[3]">
           <img @click="imgLook(item+'!small')" :src="item+'!small'">
            <span>其他{{index+1}}</span>
            <div class="checkdiv"><el-checkbox @change="handleCheckedCitiesChange2" v-model="files2" :label="item+';其他'+(index+1)" ></el-checkbox></div>
            <el-checkbox style="display:none;" v-model="files2a" :checked="ischecked" :label="item+'!small;其他'+(index+1)" ></el-checkbox>
          </li>
        </ul>
      </div>
    </div>
    <div class="timeline">
      <div class="timeline_num">7</div>
      <div class="timeline_main">
        <div class="timeline_title">用户出院上传结算费用明细</div>
        <div>
          <span v-if="detail.personNames[6]">负责人：{{detail.personNames[6]}}&nbsp;&nbsp;&nbsp;&nbsp;</span>
          <span v-if="detail.orderFlow.refuseBalance==false" class="green">资料已确认&nbsp;&nbsp;</span>
          <span v-if="detail.orderFlow.refuseBalance==true" class="red">资料已驳回&nbsp;&nbsp;</span>
          <span
            v-if="detail.orderFlow.refuseBalance!=null"
          >{{detail.orderFlow.balanceFilesTime|formatDate2}}&nbsp;&nbsp;</span>
          <el-button
            v-if="detail.orderFlow.refuseBalance!=false"
            size="small"
            type="primary"
            @click="detail.orderFlow.refuseBalance=false;submit();postWx('5')"
          >资料确认</el-button>
          <el-button
            v-if="detail.orderFlow.refuseBalance==null"
            size="small"
            type="warning"
            @click="detail.orderFlow.refuseBalance=true;submit();postWx('6')"
          >资料驳回</el-button>

          <el-button size="small" @click="addUpload3=true" type="success">补充上传</el-button>
          <el-button size="small" @click="addZip('3')" type="success">打包下载</el-button>
          <el-checkbox style="margin-left:10px;" v-model="checkAll3" @change="handleCheckAllChange3">全选</el-checkbox>
        </div>
        <ul class="piclist" v-if="balanceFilesList">
          <li v-if="balanceFilesList[0]!=''" v-for="(item,index) in balanceFilesList[0]">
            <img @click="imgLook(item+'!small')" :src="item+'!small'">
            <span>住院发票{{index+1}}</span>
            <div class="checkdiv"><el-checkbox @change="handleCheckedCitiesChange3" v-model="files3" :label="item+';住院发票'+(index+1)" ></el-checkbox></div>
            <el-checkbox style="display:none;" v-model="files3a" :checked="ischecked" :label="item+'!small;住院发票'+(index+1)" ></el-checkbox>
          </li>
          <li v-if="balanceFilesList[1]!=''" v-for="(item,index) in balanceFilesList[1]">
            <img @click="imgLook(item+'!small')" :src="item+'!small'">
            <span>诊断证明书{{index+1}}</span>
            <div class="checkdiv"><el-checkbox @change="handleCheckedCitiesChange3" v-model="files3" :label="item+';诊断证明书'+(index+1)" ></el-checkbox></div>
            <el-checkbox style="display:none;" v-model="files3a" :checked="ischecked" :label="item+'!small;诊断证明书'+(index+1)" ></el-checkbox>
          </li>
          <li v-if="balanceFilesList[2]!=''" v-for="(item,index) in balanceFilesList[2]">
            <img @click="imgLook(item+'!small')" :src="item+'!small'">
            <span>出院小结{{index+1}}</span>
            <div class="checkdiv"><el-checkbox @change="handleCheckedCitiesChange3" v-model="files3" :label="item+';出院小结'+(index+1)" ></el-checkbox></div>
            <el-checkbox style="display:none;" v-model="files3a" :checked="ischecked" :label="item+'!small;出院小结'+(index+1)" ></el-checkbox>
          </li>
          <li v-if="balanceFilesList[3]!=''" v-for="(item,index) in balanceFilesList[3]">
           <img @click="imgLook(item+'!small')" :src="item+'!small'">
            <span>结算费用清单{{index+1}}</span>
            <div class="checkdiv"><el-checkbox @change="handleCheckedCitiesChange3" v-model="files3" :label="item+';结算费用清单'+(index+1)" ></el-checkbox></div>
            <el-checkbox style="display:none;" v-model="files3a" :checked="ischecked" :label="item+'!small;结算费用清单'+(index+1)" ></el-checkbox>
          </li>
          <li v-if="balanceFilesList[4]!=''" v-for="(item,index) in balanceFilesList[4]">
            <img @click="imgLook(item+'!small')" :src="item+'!small'">
            <span>住院病历{{index+1}}</span>
            <div class="checkdiv"><el-checkbox @change="handleCheckedCitiesChange3" v-model="files3" :label="item+';住院病历'+(index+1)" ></el-checkbox></div>
            <el-checkbox style="display:none;" v-model="files3a" :checked="ischecked" :label="item+'!small;住院病历'+(index+1)" ></el-checkbox>
          </li>
          <li v-if="balanceFilesList[5]!=''" v-for="(item,index) in balanceFilesList[5]">
            <img @click="imgLook(item+'!small')" :src="item+'!small'">
            <span>垫付确认书{{index+1}}</span>
            <div class="checkdiv"><el-checkbox @change="handleCheckedCitiesChange3" v-model="files3" :label="item+';垫付确认书'+(index+1)" ></el-checkbox></div>
            <el-checkbox style="display:none;" v-model="files3a" :checked="ischecked" :label="item+'!small;垫付确认书'+(index+1)" ></el-checkbox>
          </li>
          <li v-if="balanceFilesList[6]!=''" v-for="(item,index) in balanceFilesList[6]">
            <img @click="imgLook(item+'!small')" :src="item+'!small'">
            <span>门诊发票原件{{index+1}}</span>
            <div class="checkdiv"><el-checkbox @change="handleCheckedCitiesChange3" v-model="files3" :label="item+';门诊发票原件'+(index+1)" ></el-checkbox></div>
            <el-checkbox style="display:none;" v-model="files3a" :checked="ischecked" :label="item+'!small;门诊发票原件'+(index+1)" ></el-checkbox>
          </li>
          <li v-if="balanceFilesList[7]!=''" v-for="(item,index) in balanceFilesList[7]">
            <img @click="imgLook(item+'!small')" :src="item+'!small'">
            <span>病理报告{{index+1}}</span>
            <div class="checkdiv"><el-checkbox @change="handleCheckedCitiesChange3" v-model="files3" :label="item+';病理报告'+(index+1)" ></el-checkbox></div>
            <el-checkbox style="display:none;" v-model="files3a" :checked="ischecked" :label="item+'!small;病理报告'+(index+1)" ></el-checkbox>
          </li>
          <li v-if="balanceFilesList[8]!=''" v-for="(item,index) in balanceFilesList[8]">
            <img @click="imgLook(item+'!small')" :src="item+'!small'">
            <span>检查报告{{index+1}}</span>
            <div class="checkdiv"><el-checkbox @change="handleCheckedCitiesChange3" v-model="files3" :label="item+';检查报告'+(index+1)" ></el-checkbox></div>
            <el-checkbox style="display:none;" v-model="files3a" :checked="ischecked" :label="item+'!small;检查报告'+(index+1)" ></el-checkbox>
          </li>
          <li v-if="balanceFilesList[9]!=''" v-for="(item,index) in balanceFilesList[9]">
            <img @click="imgLook(item+'!small')" :src="item+'!small'">
            <span>其他{{index+1}}</span>
            <div class="checkdiv"><el-checkbox @change="handleCheckedCitiesChange3" v-model="files3" :label="item+';其他'+(index+1)" ></el-checkbox></div>
            <el-checkbox style="display:none;" v-model="files3a" :checked="ischecked" :label="item+'!small;其他'+(index+1)" ></el-checkbox>
          </li>
        </ul>
      </div>
    </div>
    <div class="timeline">
      <div class="timeline_num">8</div>
      <div class="timeline_main">
        <div class="timeline_title">生成理赔单</div>
        <span v-if="detail.personNames[7]">负责人：{{detail.personNames[7]}}&nbsp;&nbsp;&nbsp;&nbsp;</span>
        <el-button size="small" type="primary" @click="claimDiv=true">提交理赔信息</el-button>
        &nbsp;&nbsp;{{detail.orderFlow.claimIdTime|formatDate2}}
      </div>
    </div>
    <div class="timeline">
      <div class="timeline_num">9</div>
      <div class="timeline_main">
        <div class="timeline_title">用户欠费追缴</div>
        <div>
          <span v-if="detail.personNames[8]">负责人：{{detail.personNames[8]}}&nbsp;&nbsp;&nbsp;&nbsp;</span>
          需追缴用户欠费
          <!-- {{detail.orderFlow.needMoney}} -->
          <span
            v-if="claimMain.backMoney"
          >{{Number(claimMain.totalMoney)-Number(claimMain.backMoney)-Number(claimMain.compensateMoney)}}</span>
          元&nbsp;&nbsp;
          <el-button
            v-if="detail.orderFlow.finishNeedMoney==null"
            size="small"
            type="primary"
            @click="detail.orderFlow.finishNeedMoney=true;submit()"
          >确认追缴完成</el-button>
          <span v-if="detail.orderFlow.finishNeedMoney==true" class="green">用户欠费追缴已确认</span>
          &nbsp;&nbsp;
          {{detail.orderFlow.finishNeedMoneyTime|formatDate2}}
        </div>
      </div>
    </div>
    <div class="timeline">
      <div class="timeline_num">10</div>
      <div class="timeline_main">
        <div class="timeline_title">服务完成</div>
        <div>
          <span v-if="detail.personNames[9]">负责人：{{detail.personNames[9]}}&nbsp;&nbsp;&nbsp;&nbsp;</span>
          服务完成时间：{{detail.orderFlow.finishTime|formatDate2}}
        </div>
      </div>
    </div>

    <el-dialog title="转单给" :visible.sync="zhuandan" width="30%">
      <user-address ref="AddAddress" @countryChange="getPerson"/>
      <el-select
        style="width:100%;margin-top:15px;"
        v-model="form.personId"
        class="com-input"
        placeholder="请选择人员"
      >
        <el-option
          v-for="item in personList"
          :key="item.id"
          :label="item.userName"
          :value="item.id"
        />
      </el-select>
      <span slot="footer" class="dialog-footer">
        <el-button @click="zhuandan = false">取 消</el-button>
        <el-button type="primary" @click="zhuandanSubmit">确 定</el-button>
      </span>
    </el-dialog>

    <el-dialog title="提交理赔信息" :visible.sync="claimDiv" width="30%">
      <div class="dflist">
        <span class="dfspan">首次垫付时间：</span>
        <span v-if="claimMain.prePayTimes">{{parseInt(claimMain.prePayTimes[0])|formatDate2}}</span>
      </div>
      <div class="dflist">
        <span class="dfspan">二次垫付时间：</span>
        <span v-if="claimMain.prePayTimes">{{parseInt(claimMain.prePayTimes[1])|formatDate2}}</span>
      </div>
      <div class="dflist">
        <span class="dfspan">总垫付次数：</span>
        <span v-if="detail.orderFlow.prePayMoney">{{detail.orderFlow.prePayMoney.split(",").length}}</span>
        次
      </div>
      <div class="dflist">
        <span class="dfspan">总垫付金额：</span>
        {{claimMain.totalMoney}}元
      </div>
      <div class="dflist">
        <span class="dfspan">退费金额：</span>
        <el-input type="number" style="width:100px" v-model="claimMain.backMoney"></el-input>&nbsp;&nbsp;元
      </div>
      <div class="dflist">
        <span class="dfspan">实际垫付金额：</span>
        {{Number(claimMain.totalMoney)-Number(claimMain.backMoney)}}元
      </div>
      <div class="dflist">
        <span class="dfspan">理赔金额：</span>
        <el-input type="number" style="width:100px" v-model="claimMain.compensateMoney"></el-input>&nbsp;&nbsp;元
      </div>
      <div class="dflist">
        <span class="dfspan">应追缴金额：</span>
        {{Number(claimMain.totalMoney)-Number(claimMain.backMoney)-Number(claimMain.compensateMoney)}}元
      </div>

      <span slot="footer" class="dialog-footer">
        <el-button @click="claimDiv = false">取 消</el-button>
        <el-button type="primary" @click="claim">确 定</el-button>
      </span>
    </el-dialog>

    <el-dialog title="补充上传" :visible.sync="addUpload" width="30%">
      <el-form label-width="80px">
        <el-form-item label="上传分类">
          <el-select v-model="addUploadSort" placeholder="请选择上传分类">
            <el-option label="门诊病历影像件" value="0"></el-option>
            <el-option label="医疗垫付协议书" value="1"></el-option>
            <el-option label="企业版保险金额授权书" value="2"></el-option>
            <el-option label="企业版受托人声明书" value="3"></el-option>
            <el-option label="个人版保险金领款授权书" value="4"></el-option>
            <el-option label="个人版受托人声明书" value="5"></el-option>
            <el-option label="个人理赔申请书" value="6"></el-option>
            <el-option label="用户身份证正面" value="7"></el-option>
            <el-option label="用户身份证反面" value="8"></el-option>
            <el-option label="用户保单复印件" value="9"></el-option>
            <el-option label="用户银行卡正面" value="10"></el-option>
            <el-option label="预交费凭证" value="11"></el-option>
            <el-option label="社保卡或新农合" value="12"></el-option>
            <el-option label="入院通知书" value="13"></el-option>
            <el-option label="其他" value="14"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="上传文件">
          <input @change="fileChange" type="file" name="file" id="upPhoto">
          <img v-if="addUploadUrl" :src="addUploadUrl" class="avatar">
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="addUpload = false">取 消</el-button>
        <el-button type="primary" @click="addUploadSubmit">确 定</el-button>
      </span>
    </el-dialog>

    <el-dialog title="补充上传" :visible.sync="addUpload2" width="30%">
      <el-form label-width="80px">
        <el-form-item label="上传分类">
          <el-select v-model="addUploadSort2" placeholder="请选择上传分类">
            <el-option label="住院押金条" value="0"></el-option>
            <el-option label="入院垫付协议" value="1"></el-option>
            <el-option label="刷卡凭条" value="2"></el-option>
            <el-option label="其他" value="3"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="上传文件">
          <input @change="fileChange2" type="file" name="file" id="upPhoto">
          <img v-if="addUploadUrl2" :src="addUploadUrl2" class="avatar">
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="addUpload2 = false">取 消</el-button>
        <el-button type="primary" @click="addUploadSubmit2">确 定</el-button>
      </span>
    </el-dialog>

    <el-dialog title="补充上传" :visible.sync="addUpload3" width="30%">
      <el-form label-width="80px">
        <el-form-item label="上传分类">
          <el-select v-model="addUploadSort3" placeholder="请选择上传分类">
            <el-option label="住院发票" value="0"></el-option>
            <el-option label="诊断证明书" value="1"></el-option>
            <el-option label="出院小结" value="2"></el-option>
            <el-option label="结算费用清单" value="3"></el-option>
            <el-option label="住院病历" value="4"></el-option>
            <el-option label="垫付确认书" value="5"></el-option>
            <el-option label="门诊发票原件" value="6"></el-option>
            <el-option label="病理报告" value="7"></el-option>
            <el-option label="检查报告" value="8"></el-option>
            <el-option label="其他" value="9"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="上传文件">
          <input @change="fileChange3" type="file" name="file" id="upPhoto">
          <img v-if="addUploadUrl3" :src="addUploadUrl3" class="avatar">
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="addUpload3 = false">取 消</el-button>
        <el-button type="primary" @click="addUploadSubmit3">确 定</el-button>
      </span>
    </el-dialog>

    <el-dialog title="关闭订单" :visible.sync="close" width="30%">
      <el-input type="textarea" :rows="2" placeholder="请填写关闭原因" v-model="reason"></el-input>

      <span slot="footer" class="dialog-footer">
        <el-button @click="close = false">取 消</el-button>
        <el-button type="primary" @click="closeSubmit">确 定</el-button>
      </span>
    </el-dialog>

    <el-dialog title="打包下载" :visible.sync="addZipDiv" width="30%">
      <el-form label-width="100px">
        <el-form-item label="压缩包文件名">
          <el-input type="text" v-model="fileName"></el-input>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="addZipDiv = false">取 消</el-button>
        <el-button type="primary" @click="submitZip">打包下载</el-button>
      </span>
    </el-dialog>

    <el-dialog custom-class="bigDig" :visible.sync="imgDiv" :show-close="false">
      <img :src="imgUrl">
    </el-dialog>
  </div>
</template>

<script>
const queryString = require("querystring");
var JSZip = require("jszip");
import FileSaver from 'file-saver';
import UserAddress from "components/address";
import { ScondDay } from "utils/formData";
import { FileChange } from "utils/formData";
export default {
  data() {
    return {
      stateValue: this.$route.query.stateValue,
      childStateValue: this.$route.query.childStateValue,
      remark: this.$route.query.remark,
      deleteFlag: this.$route.query.deleteFlag,
      personList: [],
      form: {
        id: this.$route.query.id,
        personId: "",
        remark: ""
      },
      searchForm: {
        province: "",
        city: "",
        country: ""
      },
      detail: {
        orderListVO: {},
        template: {},
        groundPersonListVO: {
          id: "",
          provinceValue: "",
          cityValue: "",
          countryValue: "",
          userName: "",
          remark: ""
        },
        orderFlow: {
          id: "",
          operatorId: "",
          createTime: "",
          updateTime: "",
          productOrderId: "",
          groundPersonId: null,
          groundPersonIdTime: null,
          claimId: null,
          claimIdTime: null,
          hasContact: null,
          hasContactTime: null,
          hasChecked: null,
          hasCheckedTime: null,
          prePayFiles: null,
          prePayFileConfirm: null,
          prePayFileConfirmTime: null,
          prePayMoney: null,
          refusePay: null,
          prePayMoneyTime: null,
          depositFiles: null,
          depositFilesTime: null,
          refuseDeposit: null,
          balanceFiles: null,
          balanceFilesTime: null,
          refuseBalance: null,
          needMoney: null,
          finishNeedMoney: null,
          finishNeedMoneyTime: null,
          finishTime: null
        },
        personNames: []
      },
      claimMain: {
        productOrderId: this.$route.query.id,
        orderFlowId: "",
        prePayTimes: "",
        totalMoney: "",
        backMoney: "",
        realPayMoney: "",
        compensateMoney: "",
        needMoney: ""
      },
      zhuandan: false,
      imgDiv: false,
      imgUrl: "",
      isSend: false,
      claimDiv: false,
      close: false,
      prePayFilesList: null,
      depositFilesList: null,
      balanceFilesList: null,
      addUpload: false,
      addUpload2: false,
      addUpload3: false,
      addUploadSort: "",
      addUploadSort2: "",
      addUploadSort3: "",
      addUploadUrl: "",
      addUploadUrl2: "",
      addUploadUrl3: "",
      reason: this.$route.query.reason,
      addPayList: [],
      prePayMoney1: "",
      prePayMoney2: "",
      backM: "",
      compM: "",
      addZipDiv:false,
      files1:[],
      files2:[],
      files3:[],
      files:"",
      fileName:"",
      zipSort:"",
      imgArr:[],
      imgArrName:[],
      checkAll: false,
      checkAll2: false,
      checkAll3: false,
      ischecked:true,
      files1a:[],
      files2a:[],
      files3a:[],
      filesNum:1
    };
  },
  created() {
    this.getDetail();
    this.getClaim();
  },
  components: {
    UserAddress
  },
  mounted() {},
  methods: {
      handleCheckAllChange(val) {
        this.files1 = val?this.files1a:[];
      },
      handleCheckedCitiesChange(value) {
        if(this.files1.length==this.files1a.length){
           this.checkAll=true
        }else{
          this.checkAll=false;
        }
      },
      handleCheckAllChange2(val) {
        this.files2 = val?this.files2a:[];
      },
      handleCheckedCitiesChange2(value) {
        if(this.files2.length==this.files2a.length){
           this.checkAll2=true
        }else{
          this.checkAll2=false;
        }
      },
      handleCheckAllChange3(val) {
        this.files3 = val?this.files3a:[];
      },
      handleCheckedCitiesChange3(value) {
        if(this.files3.length==this.files3a.length){
           this.checkAll3=true
        }else{
          this.checkAll3=false;
        }
      },
    addZip(type){
      if(type=='1'){
         if(this.files1.length>0){
           this.addZipDiv=true;
           this.zipSort='1';
           this.fileName='押金垫付已签署文件'
         }else{
           this.$message("请最少勾选一张图片！");
         }
      }else if(type=='2'){
         if(this.files2.length>0){
           this.addZipDiv=true;
           this.zipSort='2';
           this.fileName='住院押金条'
         }else{
           this.$message("请最少勾选一张图片！");
         }
      }else{
         if(this.files3.length>0){
           this.addZipDiv=true;
           this.zipSort='3';
           this.fileName='结算费用明细'
         }else{
           this.$message("请最少勾选一张图片！");
         }
      }
    },
    submitZip(){
       if(this.zipSort=='1'){
         this.files=this.files1;
       } else if(this.zipSort=='2'){
         this.files=this.files2;
       } else if(this.zipSort=='3'){
         this.files=this.files3;
       }
       let that=this;
       var zip = new JSZip();
       that.addZipDiv=false;
       const loading = this.$loading({
          lock: true,
          text: '努力下载中',
          spinner: 'el-icon-loading',
          background: 'rgba(0, 0, 0, 0.7)'
        }); 
        that.filesNum=1;

       for(let i=0;i<that.files.length;i++){
          let imgLink = that.files[i].split(';')[0];
          let imgName = that.files[i].split(';')[1];
          let tempImage = new Image();
            tempImage.crossOrigin = "*";
            tempImage.onload = function(){
                let base64 = that.getBase64Image(tempImage);
                that.imgArr[i]=base64.split(",")[1];
                that.imgArrName[i]=imgName;
                that.filesNum=that.filesNum+1;
            }
            tempImage.src = imgLink;
       }
       var myVar = setInterval(() => {
              if(that.filesNum==(that.files.length+1)){
                    for(var a=0;a<that.files.length;a++){
                      zip.file(that.imgArrName[a]+'.jpg', that.imgArr[a], {base64: true});
                    }
                    
                        zip.generateAsync({type:"blob"})
                        .then(function(content) {
                            saveAs(content, that.fileName+".zip");
                          });
                        loading.close();
                        clearInterval(myVar);
                   
                }
        }, 1000);

       
      //  setTimeout(()=>{
      //     for(var i=0;i<that.files.length;i++){
      //       zip.file(that.imgArrName[i]+'.jpg', that.imgArr[i], {base64: true});
      //     }
      //     zip.generateAsync({type:"blob"})
      //     .then(function(content) {
      //         saveAs(content, that.fileName+".zip");
      //       });
      //     loading.close();
      //  },2000)
    },
    getBase64Image(img) {
            var canvas = document.createElement("canvas");
            canvas.width = img.width;
            canvas.height = img.height;
            var ctx = canvas.getContext("2d");
            ctx.drawImage(img, 0, 0, img.width, img.height);
            var ext = img.src.substring(img.src.lastIndexOf(".")+1).toLowerCase();
            var dataURL = canvas.toDataURL("image/"+ext);
            return dataURL;
        },
    getDetail() {
      this.axios
        .get("/productOrder/" + this.$route.query.id)
        .then(res => {
          if (res.data.code === 200) {
            if (res.data.data.groundPersonListVO) {
              this.detail.groundPersonListVO = res.data.data.groundPersonListVO;
            }
            if (res.data.data.orderFlow) {
              this.detail.orderFlow = res.data.data.orderFlow;
              if (res.data.data.orderFlow.prePayFiles) {
                this.prePayFilesList = res.data.data.orderFlow.prePayFiles.split(
                  ";"
                );
                for (var i = 0; i < this.prePayFilesList.length; i++) {
                  this.prePayFilesList[i] = this.prePayFilesList[i].split(",");
                }
              }
              if (res.data.data.orderFlow.depositFiles) {
                this.depositFilesList = res.data.data.orderFlow.depositFiles.split(
                  ";"
                );
                for (var i = 0; i < this.depositFilesList.length; i++) {
                  this.depositFilesList[i] = this.depositFilesList[i].split(
                    ","
                  );
                }
              }
              if (res.data.data.orderFlow.balanceFiles) {
                this.balanceFilesList = res.data.data.orderFlow.balanceFiles.split(
                  ";"
                );
                for (var i = 0; i < this.balanceFilesList.length; i++) {
                  this.balanceFilesList[i] = this.balanceFilesList[i].split(
                    ","
                  );
                }
              }

              if (res.data.data.orderFlow.prePayMoney) {
                var arry = res.data.data.orderFlow.prePayMoney.split(",");
                this.prePayMoney1 = arry[0];
                this.addPayList = arry.slice(1);
              }
              this.claimMain.orderFlowId = res.data.data.orderFlow.id;
            }
            this.detail.orderListVO = res.data.data.orderListVO;
            this.detail.productId = res.data.data.productId;
            this.detail.productName = res.data.data.productName;
            this.detail.template = res.data.data.template;
            if(res.data.data.personNames){
              this.detail.personNames = res.data.data.personNames;
            }
            
            this.prePayMoney2 = "";
          }
        })
        .catch(err => {
          console.log(err);
        });
    },
    sendAddPay() {
      if (this.prePayMoney1 != "") {
        this.$confirm("提交后价格将不能修改, 是否继续?", "提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        })
          .then(() => {
            this.detail.orderFlow.refusePay = false;
            this.submit("pay");
            this.isSend = false;
            setTimeout(() => {
              this.postClaim();
            }, 2000);
          })
          .catch(() => {});
      } else {
        this.$message("请填写金额！");
      }
    },
    sendAddPay2() {
      if (this.prePayMoney2 != "") {
        this.$confirm("提交后价格将不能修改, 是否继续?", "提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        })
          .then(() => {
            this.submit("pay");
            this.isSend = false;
            setTimeout(() => {
              this.postClaim();
            }, 2000);
          })
          .catch(() => {});
      } else {
        this.$message("请填写金额！");
      }
    },
    getClaim() {
      this.axios
        .get("/claim?productOrderId=" + this.$route.query.id)
        .then(res => {
          if (res.data.code === 200) {
            if (res.data.data) {
              this.claimMain = res.data.data;
              if (res.data.data.prePayTimes) {
                this.claimMain.prePayTimes = res.data.data.prePayTimes.split(
                  ","
                );
              }
            }
          }
        })
        .catch(err => {
          console.log(err);
          this.$message(this.mes.busy);
        });
    },
    closeSubmit() {
      this.axios
        .delete(
          "/productOrder/" + this.$route.query.id + "?reason=" + this.reason
        )
        .then(res => {
          if (res.data.code === 200) {
            this.$message({
              type: "success",
              message: "删除成功!"
            });
            this.$router.back(-1);
          }
        })
        .catch(err => {
          console.log(err);
          this.$message(this.mes.busy);
        });
    },
    intPerson() {
      this.searchForm.province = "";
      this.searchForm.city = "";
      this.searchForm.country = "";
      this.api
        .get("/groundPerson?" + queryString.stringify(this.searchForm))
        .then(res => {
          if (res.code == 200) {
            this.personList = res.data.list;
          }
        })
        .catch(err => {
          console.log(err);
        });
    },
    getPerson() {
      let addressParams = this.$refs.AddAddress.getData();
      this.searchForm.province = addressParams.province;
      this.searchForm.city = addressParams.city;
      this.searchForm.country = addressParams.country;
      this.api
        .get("/groundPerson?" + queryString.stringify(this.searchForm))
        .then(res => {
          if (res.code == 200) {
            this.personList = res.data.list;
          }
        })
        .catch(err => {
          console.log(err);
        });
    },
    zhuandanSubmit() {
      this.api
        .put(
          "/productOrder/" + this.$route.query.id + "/groundPerson",
          this.form,
          "form"
        )
        .then(res => {
          if (res.code == 200) {
            this.$message("操作成功！");
            this.zhuandan = false;
            this.getDetail();
            this.getClaim();
          }
        })
        .catch(res => {
          console.log(res);
        });
    },
    imgLook(url) {
      this.imgDiv = true;
      this.imgUrl = url;
    },
    back() {
      this.$router.back(-1);
    },
    postClaim() {
      delete this.claimMain.createTime;
      delete this.claimMain.realPayMoney;
      delete this.claimMain.updateTime;

      if (this.claimMain.backMoney == null) {
        delete this.claimMain.backMoney;
      }
      if (this.claimMain.compensateMoney == null) {
        delete this.claimMain.compensateMoney;
      }

      if (this.claimMain.prePayTimes) {
        this.claimMain.prePayTimes =
          this.claimMain.prePayTimes + "," + new Date().valueOf();
      } else {
        this.claimMain.prePayTimes = new Date().valueOf();
      }
      let total = this.detail.orderFlow.prePayMoney.split(",");
      this.claimMain.totalMoney = total.reduce(function(
        preValue,
        curValue,
        index,
        array
      ) {
        return Number(preValue) + Number(curValue);
      });

      if (this.claimMain.backMoney) {
        this.backM = Number(this.claimMain.backMoney);
      } else {
        this.backM = Number(0);
      }
      if (this.claimMain.compensateMoney) {
        this.compM = Number(this.claimMain.compensateMoney);
      } else {
        this.compM = Number(0);
      }
      this.claimMain.needMoney =
        Number(this.claimMain.totalMoney) - this.backM - this.compM;

      if (this.claimMain.id) {
        this.api
          .put("/claim", this.claimMain, "form")
          .then(res => {
            this.getClaim();
          })
          .catch(err => {
            console.log(err);
            this.$message(err.data.message);
          });
      } else {
        this.api
          .post("/claim", this.claimMain, "form")
          .then(res => {
            this.getClaim();
          })
          .catch(err => {
            console.log(err);
            this.$message(err.data.message);
          });
      }
    },
    claim() {
      delete this.claimMain.createTime;

      if (this.claimMain.prePayTimes == null) {
        delete this.claimMain.prePayTimes;
      }
      if (this.claimMain.totalMoney == null) {
        delete this.claimMain.totalMoney;
      }
      delete this.claimMain.realPayMoney;
      delete this.claimMain.updateTime;

      if (this.claimMain.backMoney == null) {
        this.claimMain.backMoney = "0";
      }
      if (this.claimMain.compensateMoney == null) {
        this.claimMain.compensateMoney = "0";
      }
      if (this.claimMain.totalMoney) {
        this.claimMain.needMoney =
          Number(this.claimMain.totalMoney) -
          Number(this.claimMain.backMoney) -
          Number(this.claimMain.compensateMoney);
      }

      if (this.claimMain.id) {
        this.api
          .put("/claim", this.claimMain, "form")
          .then(res => {
            this.claimDiv = false;
          })
          .catch(err => {
            console.log(err);
            this.claimDiv = false;
            this.$message(err.data.message);
          });
      } else {
        this.api
          .post("/claim", this.claimMain, "form")
          .then(res => {
            this.claimDiv = false;
          })
          .catch(err => {
            console.log(err);
            this.claimDiv = false;
            this.$message(err.data.message);
          });
      }
    },
    fileChange(e) {
      FileChange(e, res => {
        this.addUploadUrl = res.url;
      });
    },
    fileChange2(e) {
      FileChange(e, res => {
        this.addUploadUrl2 = res.url;
      });
    },
    fileChange3(e) {
      FileChange(e, res => {
        this.addUploadUrl3 = res.url;
      });
    },
    addUploadSubmit() {
      if (this.addUploadSort) {
        let i = Number(this.addUploadSort);
        if(this.prePayFilesList){
            if (this.prePayFilesList[i][0] == "") {
              this.prePayFilesList[i][0] = this.addUploadUrl;
            } else {
              this.prePayFilesList[i] = this.prePayFilesList[i].concat(
                this.addUploadUrl
              );
            }
        }else{
          this.prePayFilesList=["","","","","","","","","","","","","","",""];
          this.prePayFilesList[i] = this.addUploadUrl;
        }
        
        this.addUpload = false;
        this.submit();
      } else {
        this.$message("请选择上传分类");
      }
    },
    addUploadSubmit2() {
      if (this.addUploadSort2) {
        let i = Number(this.addUploadSort2);
        if(this.depositFilesList){
            if (this.depositFilesList[i][0] == "") {
              this.depositFilesList[i][0] = this.addUploadUrl2;
            } else {
              this.depositFilesList[i] = this.depositFilesList[i].concat(
                this.addUploadUrl2
              );
            }
         }else{
          this.depositFilesList=["","","",""];
          this.depositFilesList[i] = this.addUploadUrl2;
        }

        this.addUpload2 = false;
        this.submit();
      } else {
        this.$message("请选择上传分类");
      }
    },
    addUploadSubmit3() {
      if (this.addUploadSort3) {
        let i = Number(this.addUploadSort3);
        if(this.balanceFilesList){
            if (this.balanceFilesList[i][0] == "") {
              this.balanceFilesList[i][0] = this.addUploadUrl3;
            } else {
              this.balanceFilesList[i] = this.balanceFilesList[i].concat(
                this.addUploadUrl3
              );
            }
        }else{
          this.balanceFilesList=["","","","","","","","","",""];
          this.balanceFilesList[i] = this.addUploadUrl3;
        }
        this.addUpload3 = false;
        this.submit();
      } else {
        this.$message("请选择上传分类");
      }
    },
    postWx(id){
      this.api
          .post("/orderFlow/stateChange", {state:id,productOrderId:this.$route.query.id}, "form")
          .then(res => {
            console.log(res)
          })
          .catch(err => {
            console.log(err);
            this.$message(err.data.message);
          });
    },
    submit(pay) {
      let editOrder = {
        //prePayFiles: this.prePayFilesList.join(";"),
        //prePayFileConfirm: this.detail.orderFlow.prePayFileConfirm,
        //prePayMoney: this.detail.orderFlow.prePayMoney,
        //refusePay: this.detail.orderFlow.refusePay,
        //depositFiles: this.depositFilesList.join(";"),
        //refuseDeposit: this.detail.orderFlow.refuseDeposit,
        //balanceFiles: this.balanceFilesList.join(";"),
        //refuseBalance: this.detail.orderFlow.refuseBalance,
        //finishNeedMoney: this.detail.orderFlow.finishNeedMoney,
        //id: this.detail.orderFlow.id,
        productOrderId: this.detail.orderFlow.productOrderId
      };
      if (this.prePayFilesList) {
        editOrder.prePayFiles = this.prePayFilesList.join(";");
      }
      if (this.depositFilesList) {
        editOrder.depositFiles = this.depositFilesList.join(";");
      }
      if (this.balanceFilesList) {
        editOrder.balanceFiles = this.balanceFilesList.join(";");
      }
      if (this.detail.orderFlow.id) {
        editOrder.id = this.detail.orderFlow.id;
      }
      if (pay == "pay") {
        if (this.detail.orderFlow.prePayMoney != null) {
          editOrder.prePayMoney =
            this.detail.orderFlow.prePayMoney + "," + this.prePayMoney2;
        } else {
          editOrder.prePayMoney = this.prePayMoney1;
        }
      } else {
        delete editOrder.prePayMoney;
      }

      if (this.detail.orderFlow.finishNeedMoney != null) {
        editOrder.finishNeedMoney = this.detail.orderFlow.finishNeedMoney;
      }

      if (this.detail.orderFlow.prePayFileConfirm != null) {
        editOrder.prePayFileConfirm = this.detail.orderFlow.prePayFileConfirm;
      }
      if (this.detail.orderFlow.refusePay != null) {
        editOrder.refusePay = this.detail.orderFlow.refusePay;
      }
      if (this.detail.orderFlow.refuseDeposit != null) {
        editOrder.refuseDeposit = this.detail.orderFlow.refuseDeposit;
      }
      if (this.detail.orderFlow.refuseBalance != null) {
        editOrder.refuseBalance = this.detail.orderFlow.refuseBalance;
      }
      this.api
        .put("/productOrder/orderFlow", editOrder, "form")
        .then(res => {
          this.$message("订单修改成功");
          this.getDetail();
        })
        .catch(err => {
          console.log(err);
        });
    }
  },
  filters: {
    formatDate: function(time) {
      if (time) {
        let date = new Date(time);
        return ScondDay(time);
      } else {
        return "";
      }
    },
    formatDate2: function(time) {
      if (time) {
        var date = new Date(time);
        var Y = date.getFullYear() + "-";
        var M =
          (date.getMonth() + 1 < 10
            ? "0" + (date.getMonth() + 1)
            : date.getMonth() + 1) + "-";
        var D =
          (date.getDate() < 10 ? "0" + date.getDate() : date.getDate()) + " ";
        var h =
          (date.getHours() < 10 ? "0" + date.getHours() : date.getHours()) +
          ":";
        var m =
          (date.getMinutes() < 10
            ? "0" + date.getMinutes()
            : date.getMinutes()) + ":";
        var s =
          date.getSeconds() < 10 ? "0" + date.getSeconds() : date.getSeconds();
        return Y + M + D + h + m + s;
      } else {
        return "";
      }
    }
  }
};
</script>

<style lang="less">
.red {
  color: #c00;
}
.green {
  color: #67c23a;
}
.main_h {
  font-weight: bold;
  margin-top: 15px;
  border-top: 1px solid #eaeaea;
  padding-top: 15px;
}
.list {
  line-height: 35px;
}
.el-dialog__body {
  padding: 15px !important;
}
.timeline {
  overflow: hidden;
  .timeline_num {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: #409eff;
    color: #fff;
    text-align: center;
    line-height: 30px;
    font-weight: bold;
    float: left;
  }
  .timeline_main {
    padding-bottom: 30px;
    margin-left: 15px;
    border-left: 2px solid #409eff;
    padding-left: 25px;
  }
  .timeline_title {
    font-size: 18px;
    font-weight: bold;
    line-height: 30px;
  }
}
.piclist {
  overflow: hidden;
  list-style: none;
  margin: 0;
  padding: 0;
}
.piclist li {
  font-size: 12px;
  list-style: none;
  width: 100px;
  float: left;
  margin-top: 10px;
  margin-right: 10px;
  text-align: center;
  position:relative;
  height:140px;
}
.piclist li img {
  width: 100px;
  height: 100px;
}
.checkdiv {
  width:20px;
  height:20px;
  overflow:hidden;
  position: absolute;
  right:0;
  top:0;
}
.bigDig {
  background: none;
}
.bigDig .el-dialog__body {
  padding: 0px !important;
}
.bigDig img {
  width: 100%;
}
.dflist {
  height: 40px;
  line-height: 40px;
  .dfspan {
    display: inline-block;
    width: 120px;
    text-align: right;
  }
}

.avatar {
  width: 178px;
  height: 178px;
  display: block;
}
</style>

